import 'package:flutter/material.dart';
import 'package:flutter02/res/list_data.dart';

class MyHomePage extends StatelessWidget {
  const MyHomePage({super.key});

  List<Widget> _initCardData() {
    return listData
        .map((value) => Card(
              elevation: 20,
              margin: const EdgeInsets.all(10),
              // color: Colors.black12,
              shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(10)),
              child: Column(
                children: [
                  AspectRatio(
                    aspectRatio: 16 / 9,
                    child: Image.network(
                      value['imageUrl'],
                      fit: BoxFit.cover,
                    ),
                  ),
                  ListTile(
                      leading: CircleAvatar(
                        backgroundImage: NetworkImage(value['imageUrl']),
                      ),
                      title: Text(
                        value['title'],
                        // style: const TextStyle(fontSize: 28),
                        maxLines: 1,
                        overflow: TextOverflow.ellipsis,
                      ),
                      subtitle: Text(value['author'])),
                ],
              ),
            ))
        .toList();
  }

  @override
  Widget build(BuildContext context) {
    // final size = MediaQuery.of(context).size;
    // NumberFormat formatter = NumberFormat("0000");
    return ListView(
      children: _initCardData(),
    );
    // ListView.builder(
    //     padding: const EdgeInsets.only(bottom: 50),
    //     itemCount: listData.length,
    //     itemBuilder: (context, index) {
    //       return Card(
    //         elevation: 20,
    //         margin: const EdgeInsets.all(10),
    //         // color: Colors.black12,
    //         shape:
    //             RoundedRectangleBorder(borderRadius: BorderRadius.circular(10)),
    //         child: Column(
    //           children: [
    //             AspectRatio(
    //               aspectRatio: 16 / 9,
    //               child: Image.network(
    //                 listData[index]['imageUrl'],
    //                 fit: BoxFit.cover,
    //               ),
    //             ),
    //             ListTile(
    //                 leading: CircleAvatar(
    //                   backgroundImage:
    //                       NetworkImage(listData[index]['imageUrl']),
    //                 ),
    //                 title: Text(
    //                   "$index.${listData[index]['title']}",
    //                   // style: const TextStyle(fontSize: 28),
    //                   maxLines: 1,
    //                   overflow: TextOverflow.ellipsis,
    //                 ),
    //                 subtitle: Text(listData[index]['author'])),
    //           ],
    //         ),
    //       );
    //     });
  }
}
